<template>
    <el-pagination :current-page="props.currentPage" :page-sizes="[20, 50, 100, 200]" :page-size="props.size"
        :total="props.total" @size-change="handleSizeChange" small background layout="sizes,total,prev, pager, next"
        @current-change="handleCurrentChange"></el-pagination>
</template>
<script setup>
const props = defineProps({
    currentPage: {
        type: Number,
        default: 1
    },
    total: {
        type: Number,
        default: 0
    },
    size: {
        type: Number,
        default: 20
    }
})

const handleCurrentChange = (page) => {
    emit('handleCurrentChange', page)
}

const handleSizeChange = (size) => {
    emit('handleSizeChange', size)
}

const emit = defineEmits(['handleSizeChange', 'handleCurrentChange'])
</script>
<style scoped lang="scss"></style>